/* 订单支付 */
.page-payment {
	.step-box {
		.left {
			.img {
				background: url(@/assets/images/icons.png) no-repeat -86px -249px;
			}
			.text {
				line-height: 40px;
			}
		}
	}
	.payment-con {
		.pay-box {
			background: #f9f9f9;
			padding: 20px;
			.pay-info {
				padding-left: 52px;
				position: relative;
				.tag {
					width: 32px;
					height: 32px;
					position: absolute;
					left: 0;
					top: 5px;
				}
				.tag.success {
					background: url(@/assets/images/icons.png) no-repeat 0 -476px;
				}
				.item {
					display: flex;
					justify-content: space-between;
					.tit {
						font-size: 14px;
						height: 20px;
						line-height: 20px;
						flex: 1;
						font-weight: 600;
					}
					.total-pay {
						height: 20px;
						line-height: 20px;
						.price {
							font-size: 18px;
							display: inline-block;
							vertical-align: top;
							line-height: 20px;
							margin-right: 3px;
						}
					}
					.rest-time {
						height: 12px;
						line-height: 12px;
						margin-top: 10px;
						flex: 1;
						color: #999;
						display: flex;
						.time {
							color: #e1251b;
							margin: 0 3px;
						}
					}
					.order-det {
						height: 12px;
						line-height: 12px;
						margin-top: 10px;
						position: relative;
						padding-right: 15px;
						-moz-transition: all 0.2s;
						-webkit-transition: all 0.2s;
						-o-transition: all 0.2s;
						transition: all 0.2s;
						cursor: pointer;
						color: #999;
						&:hover {
							color: #e1251b;
							&::before {
								border-top: 5px solid #e1251b;
								top: 4px;
							}
						}
						&::before {
							position: absolute;
							right: 0;
							display: block;
							content: " ";
							width: 0;
							height: 0;
							border: 5px solid transparent;
							border-radius: 2px;
							border-top: 5px solid #777;
							top: 4px;
						}
						&::after {
							position: absolute;
							right: 0;
							display: block;
							content: " ";
							width: 0;
							height: 0;
							border: 5px solid transparent;
							border-radius: 2px;
							border-top: 5px solid #fff;
							top: 3px;
						}
					}
				}
			}
			.order-info {
				margin-top: 30px;
				padding-top: 20px;
				border-top: 1px solid #eee;
				margin-left: 52px;
				.text {
					display: flex;
					line-height: 24px;
					margin-bottom: 8px;
					&:last-child {
						margin-bottom: 0;
					}
					.label {
						width: 70px;
					}
					.con {
						margin-right: 20px;
					}
					.con.con-items {
						flex: 1;
					}
				}
			}
		}
		.section-payment {
			margin-top: 30px;
			.item-balance {
				width: auto !important;
				position: static !important;
				.item-balance-img {
					margin: 0 auto;
					width: 36px !important;
					float: left;
					position: static !important;
					padding: 3px 0 0 25px;
				}
				.item-balance-div {
					float: left;
					padding-right: 32px;
					.item-balance-span {
						color: #999;
					}
				}
			}
			.tit {
				margin-bottom: 20px;
				font-size: 14px;
				padding: 0 20px;
				font-weight: 600;
			}
			.con {
				display: flex;
				.item {
					width: 174px;
					height: 60px;
					line-height: 60px;
					margin-left: 20px;
					margin-bottom: 20px;
					border: 1px solid #e0e0e0;
					text-align: center;
					cursor: pointer;
					overflow: hidden;
					-moz-transition: all 0.2s;
					-webkit-transition: all 0.2s;
					-o-transition: all 0.2s;
					transition: all 0.2s;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 16px;
					img {
						display: block;
						width: 28px;
						height: 28px;
						margin-right: 10px;
					}
					&:hover {
						border-color: #e1251b;
					}
					.paypal-logo {
						width: 30px;
						height: 34px;
						position: absolute;
						top: 14px;
						left: 28px;
					}
					.paypal-text {
						width: 80px;
						height: 26px;
						position: absolute;
						top: 20px;
						left: 62px;
					}
				}
				.item.active {
					border-color: #e1251b;
				}
				.item.paypal {
					display: flex;
					position: relative;
				}
			}
			.btn {
				margin-top: 10px;
				margin-left: 20px;
				display: block;
				font-size: 15px;
				font-weight: 600;
				width: 174px;
				height: 42px;
				line-height: 42px;
				background: #e1251b;
				text-align: center;
				color: #fff;
				border-radius: 2px;
				&:hover {
					opacity: 0.9;
				}
			}
			.btn.no-pay {
				cursor: not-allowed;
				background: #ccc;
			}
		}
	}
}
.time {
	margin-top: 20px;
}
